<template>
	<view class="notice">

		<view class="hot">
			<view class="goods">
				<view class="goodsitem" @click="toDetail(item.id)" v-for="(item,index) in List" :key="index">
					<image :src="getimg(item.logo_url)" mode=""></image>
					<view class="info">
						<text class="name">{{item.name}}</text>
						<view class="content">
								{{item.introduction}}
						</view>
						<text class="time">{{item.time}}</text>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import { KListMore } from '../../api/api.js'
	export default {
		data() {
			return {
				isactive: true,
				id:'',
				List:[]
			}
		},
		onLoad(e) {
			this.id = e.id
			this.KListMore()
		},
		methods: {
			toDetail(id) {
				uni.navigateTo({
					url: '/pages/noticeDetail/index?id=' + id
				})
			},
			getimg(url) {
				return this.websiteUrl + url
			},
			KListMore(){
				KListMore({
					id:this.id
				}).then(res=>{
					this.List = res.data
				})
			},
			toPage(url) {
				uni.navigateTo({
					url: url
				})
			},
			change(i) {
				if (i == 1) {
					this.isactive = true
				} else {
					this.isactive = false
				}
			}
		}
	}
</script>

<style lang="scss">
	.notice{
		background: #F7f7f7;
	}
	
	
	.hot {
		margin-top: 40rpx;
	
		.title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 90%;
			margin: 0 auto;
			border-left: 4px solid #1D3F2B;
			padding-left: 2%;
	
			.name {
				color: #1D3F2B;
				font-size: 30rpx;
				font-weight: bold;
			}
			.more{
				font-size: 12px;
				color: #ccc;
			}
		}
	
		.goods {
			width: 100%;
			background: #F7F7F7;
	
			.goodsitem {
				display: flex;
				margin: 20rpx 2.5%;
				background: #fff;
	
				image {
					width: 42%;
					height: 6rem;
				}
	
				text {
					margin: 10rpx 0;
				}
	
				.info {
					width: 52%;
					padding: 0 3%;
				}
	
				.name {
					font-size: 30rpx;
					width: 100%;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
					font-weight: bold;
				}
	
				.content {
					font-size: 14px;
					color: #888888;
					margin-top: 5px;
				}
	
				.time {
					text-align: right;
					width: 100%;
					display: block;
					font-size: 12px;
					color: #AEAEAE;
				}
			}
		}
	}
	
</style>
